<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="copyright" content=""/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <title>活动预览</title>
    <link href="<%=path%>/favicon.ico" rel="shortcut icon">
   
    
    <link href="<%=path%>/hplus/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
	<link href="<%=path%>/hplus/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
	<link href="<%=path%>/hplus/css/plugins/iCheck/custom.css" rel="stylesheet">
	<link href="<%=path%>/hplus/css/animate.min.css" rel="stylesheet">
	<link href="<%=path%>/hplus/css/style.min862f.css?v=4.1.0" rel="stylesheet">  
</head>
<body  class="gray-bg">
   <div class="wrapper wrapper-content animated fadeInRight">
    <div class="container-fluid">
      <div class="row">               
        <div class="col-md-12">
		    <div class="ibox">	
			    <div class="ibox-content text-right">
			      <h3>
					<span>
						<button  type="button" class="btn btn-primary" onclick="window.location.href='<%=path%>/api/bm/ui/createActivity1'">重新选择模板</button>
					</span>
				  </h3>
			    </div>
		     </div>  
		</div>              
        <div class="x_progress x_basics" hidden="">
                <!--步骤-->
                <div class="progress">
                    <div class="progress-bar progress-bar-warning" role="progressbar"
                         aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">
                        <span class="sr-only_1">1</span>
                        <p class="x_color_bz">选择模板</p>
                    </div>
                    <div class="progress-bar progress-bar-warning" role="progressbar"
                         aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">
                        <span class="sr-only_1">2</span>
                        <p class="x_color_bz">编辑内容</p>
                    </div>
                    <div class="progress-bar progress-bar-warning" role="progressbar"
                         aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">
                        <span class="sr-only_1">3</span>
                        <p class="x_color_bz ">分享设置</p>
                    </div>
                    <div class="progress-bar progress-bar-warning" role="progressbar"
                         aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">
                        <span class="sr-only_1">4</span>
                        <p class="x_color_bz x_color_dq" style="color:#ffc105;">活动预览</p>
                    </div>
                    <div class="progress-bar progress-bar-info" role="progressbar"
                         aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">
                        <span class="sr-only_2">√</span>
                        <p class="x_color_bz">分享</p>
                    </div>
                </div>
                <!--步骤end-->
            </div>
        <div class="col-md-12 white-bg">
            <!--内容左侧-->
            <div class="col-md-1"></div>
            <div class="col-md-6">
               <div class="col-md-12 text-center">
                   <h4 class="font_color">毕业聚餐好去处</h4>
               </div>
               <div class="col-md-12" style="height:200px">
                 <div class="ibox-content" >
                    <div class="carousel slide" id="carousel1" >
                        <div class="carousel-inner ">
                           
                        </div>
                        <a data-slide="prev" href="#carousel1" class="left carousel-control">
                            <span class="icon-prev"></span>
                        </a>
                        <a data-slide="next" href="#carousel1" class="right carousel-control">
                            <span class="icon-next"></span>
                        </a>
                    </div>
                </div>
               </div>
               <div class="col-md-12" style="margin-top:40px">
			      <form action="get" class="form-horizontal text-left col-md-12">
				      <div class="form-group">
                         <p class="font_color col-sm-2">店名:</p >
	                     <span id="store_title" class="font_color  col-sm-10"></span>
                      </div>
                      
                      <div class="form-group">
                         <p class="font_color col-sm-2">地址:</p >
	                     <span id="store_address" class="font_color  col-sm-10"></span>
                      </div>
                      
                      <div class="form-group">
                         <p class="font_color col-sm-2">电话:</p >
	                     <span id="store_phone" class="font_color  col-sm-10"></span>
                      </div>
			      </form>
				</div>  
                <div class="col-md-12 text-center">
                  <button type="button" class="btn btn-w-m btn-danger">活动须知</button>
                </div>
                <br>
                <div class="col-md-12 text-center" style="margin-top:20px">
                   ___<span class="font_color">预约聚餐</span>___
                </div>
                <div class="col-md-12" style="margin-top:20px">
                   <form action="get" class="form-horizontal center">
				      <div class="form-group col-md-12" >
				            <div class="col-sm-12 font_color" style="background-color:#FFFBE1;border-radius:5px;padding:15px">  店名:</div>
                      </div>
                       <div class="form-group col-md-12" >
				            <div class="col-sm-12 font_color" style="background-color:#FFFBE1;border-radius:5px;padding:15px">  手机号:</div>
                      </div>
                       <div class="form-group col-md-12" >
				            <div class="col-sm-12 font_color" style="background-color:#FFFBE1;border-radius:5px;padding:15px">  就餐时间:</div>
                      </div>
                       <div class="form-group col-md-12" >
				            <div class="col-sm-12 font_color" style="background-color:#FFFBE1;border-radius:5px;padding:15px">  预计人数:</div>
                      </div>
                       <div class="form-group col-md-12" >
				            <div class="col-sm-12 font_color" style="background-color:#FFFBE1;border-radius:5px;padding:15px">  预约店铺:</div>
	                      </div>
                     
			      </form>
                </div>
                
                <div class="col-md-12 text-center" style="margin-top:20px">
                                                            请完善信息方便餐厅给你发送乘车路线
                </div>
                <div class="col-md-12 text-center" style="margin-top:20px">
                   <div class="col-sm-3"></div>
                   <button type="button" class="col-sm-6  btn btn-lg  btn-danger font_color">提交预约</button>
                   <div class="col-sm-3"></div>
                </div>
                
                <div class="col-md-12 code" style="margin-top:20px">
                    <ul class="s_footer">
					</ul>   
                </div>
                <div class="col-md-12 text-center">
                                                           zhfeat提供技术服务
                </div>
         </div>
         <div class="col-md-5" style="margin-top:15px">
	          <div class="col-md-4">
	          </div>
	          <div class="col-md-3">
	             <button class="btn btn-w-m btn-outline btn-primary col-sm-1  text-right" type="button" onclick="javascript:afreshEdit();" >重新编辑</button>
	          </div>
	          <div class="col-md-1">
	          </div>	
	          <div class="col-md-3	">
	             <button class="btn btn-w-m btn-primary  col-sm-1 text-right J_x_box k_ty_btn" type="button"  data-toggle="modal" data-target="#myModal5">立即分享</button>
	          </div>
         </div>
         </div>
            
        </div>
    </div>
   </div> 
    
    
    
    <div class="shade">
        <div class="shade-som">
            <div class="shade-radius">
            </div>
        <div class="shade-som-1 font_color">活动须知</div>
           <ul class="shade-som-2">
            
           </ul>
        </div>
    </div>
    <!-- 立刻分享弹框 -->
   <div hidden="" class="modal inmodal fade" id="myModal5" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h5 class="modal-title">扫一扫立刻分享</h5>
            </div>
            <div class="modal-body text-center">
               <div  id="qrcode"></div>
            </div>

            
        </div>
    </div>
   </div>
   
   
  
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
   	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
    
    <script src="<%=path%>/hplus/js/bootstrap.min.js?v=3.3.6"></script>
    <script src="<%=path%>/hplus/js/content.min.js?v=1.0.0"></script>
    <script src="<%=path%>/hplus/js/plugins/iCheck/icheck.min.js"></script>
    <script>
    	var access_token=$.cookie('access_token');
    	var cid=$.cookie('cid');
    	var uid=$.cookie('uid');
    	var activity_id;
    	
        $('.J_x_box').click(function () {
            $('.x_popup,.s_popup3').show();
            $('.issue').show();
            activateActivity();
        });
        $('.x_popup .issue span').click(function () {
            $('.x_popup,.s_popup3').hide();
            $('.issue').hide();
        });
        
        
        
        $(document).on('click', '._store', function() {
       	 store_id=this.id;
       	 $("#store_title").html($(this).attr("name"));
   		 $("#store_address").html($(this).attr("address"));
   		 $("#store_phone").html($(this).attr("phone"));
         $(this).addClass("active").siblings().removeClass("active");
         $(".pullDown").html($(this).attr("name"));
         $("#pullDownA").css({"background":"url('images/fhbdf.png')  no-repeat 0 15px"});
         $(".DownMenu").hide();
   	});
        
        
        //重新编辑
        function afreshEdit(){
        	window.location.href = "<%=path%>/api/bm/ui/invitation01?type=edit&&activity_id="+activity_id;
        }
        
        $(function(){
        	activity_id=getQueryString("activity_id");
        	console.log(activity_id);
        	if(StringEmpty(activity_id)){
        		getActivityInfo(activity_id);
        		activityStore();
        	}
        });
        
      //获取活动信息
    	function getActivityInfo(activity_id) {
    		var url="<%=path%>/activity/detail";
    		$.post(url, {
    			"access_token" : access_token,
    			"cid" : cid,
    			"uid" : uid,
    			"activity_id" : activity_id,
    		}, function(data) {
    			
    			if (data.status == 200&&data.data!=undefined) {
    				
    				setHtml(data.data);
    			} else {
    				showDialog(data.message);
    			}
    		});
    	}
      
      function setHtml(data){
    	  console.log("活动地址--》"+data.web_url);
    	  jQuery('#qrcode').qrcode(data.web_url);
    	  
 		  $(".invitationNav-eat").html(data.name);
 		  $('#activity_detail_rule').html(data.detail_rule);
    	//设置图片
			if(StringEmpty(data.pic_url)){
				var pics = data.pic_url.split(",");
				var lunbo_html='';
				for(var i=0;i<pics.length;i++){
					if(i==0){
						lunbo_html+='<div class="item active center"><img style="height:200px"  alt="image" class="img-responsive text-center" src="'+pics[i]+'"></div>'

					}else{
						lunbo_html+='<div class="item"><img style="height:200px" alt="image" class="img-responsive" src="'+pics[i]+'"></div>'
					}
					
				}
				$(".carousel-inner").html(lunbo_html);
			}
    	
			//设置二维码
			if(StringEmpty(data.weixin_qrcode)&&!StringEmpty(data.weibo_qrcode)){
				console.log("weixin--->");
				var html_weixin='<li style="width:100%"><img id="weixin_qrcode" src="'+data.weixin_qrcode+'" /><p>微信二维码</p></li>';
				$(".s_footer").append(html_weixin); 
			}else if(StringEmpty(data.weixin_qrcode)){
				var html_weixin='<li><img id="weixin_qrcode" src="'+data.weixin_qrcode+'" /><p>微信二维码</p></li>';
				$(".s_footer").append(html_weixin); 
			}
			
	        if(StringEmpty(data.weibo_qrcode)&&!StringEmpty(data.weixin_qrcode)){
	        	console.log("weibo_qrcode");
	        	var html_weibo='<li style="width:100%"><img id="weibo_qrcode" src="'+data.weibo_qrcode+'" /><p>微博二维码</p></li>';
				$(".s_footer").append(html_weibo); 
			}else if(StringEmpty(data.weibo_qrcode)){
				var html_weibo='<li><img id="weibo_qrcode" src="'+data.weibo_qrcode+'" /><p>微博二维码</p></li>';
				$(".s_footer").append(html_weibo); 
			}
			
	        if(!StringEmpty(data.weibo_qrcode)&&!StringEmpty(data.weixin_qrcode))
	        	$('.pleasantly').hide();
	        
            
            //设置活动须知
           var  detail_url_html='<li>'+data.detail_rule+'</li>';
            $('.shade-som-2').html(detail_url_html);
            
            var button_css=data.button_css;
		    var theme_info_color=data.theme_info_color;
		    var text_info_color=data.text_info_color;
		    
		    if(StringEmpty(button_css)&&button_css!="#000000"){
		    	$(".DownMenu-order").css("background-color",button_css);
				$(".activity").css("background-color",button_css);
		    }
		    
		    if(StringEmpty(theme_info_color)&&theme_info_color!="#000000")
		    	$(".invitationNav1").css("background-color",theme_info_color);
		    if(StringEmpty(text_info_color)&&text_info_color!="#000000"){
				$(".font_color").css("color",text_info_color);
			}
			
			
      }
      //获取活动门店信息
	    function activityStore(){
	    	var url = "<%=path%>/activityStore/query";
	    	$.post(url,{
	    		"access_token" : access_token,
				"cid" : cid,
				"uid" : uid,
				"activity_id" : activity_id,
	    	},function(data){
	    		
	    		if(data.error_code == "0"){
	    			var stores=data.data;
	    			var html='';
	    			console.log("mendian--->"+data.data);
	    	    	for(var i in stores){
	    	    		$("#store_title").html(stores[i].name);
	    				$("#store_address").html(stores[i].address);
	    				$("#store_phone").html(stores[i].phone);
	    				html+='<li class="_store" id="'+stores[i].id+'" address="'+stores[i].address+'" phone="'+stores[i].phone+'" name="'+stores[i].name+'">'+stores[i].name+'</li>';
	    	    	}
	    	    	$("#stores").html(html);
	    		}else{
	    		}
	    	});
	    }
	    //激活
        function activateActivity() {
			var url = "${pageContext.request.contextPath}/activity/activate";
			$.post(url, {
				"cid" : cid,
				"uid" : uid,
				"access_token" : access_token,
				"activity_id" : activity_id,
			}, function(data) {
				
				if (data.status == 200) {
				} else {
				}
			});
		}
      
      
      function getQueryString(name) {
			var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
			var r = window.location.search.substr(1).match(reg);
			if (r != null)
				return unescape(r[2]);
			return null;
	  }
  	//判断字符串是否为空
  	function StringEmpty(content) {
  		if (content == undefined || content == "" || content == null) {
  			return false;
  		} else {
  			return true;
  		}
  	}
  	 function showDialog(title){
			$('#dialog_title').html('<img src="<%=path%>/images/marketing/s_tick.png"/>'+title+''); 
			$('.s_popup_delect2,.s_consum').show().delay(2000).fadeOut();
		}
        
    </script>
</body>
</html>